import React from 'react';

import { Col, DatePicker, Form, Input, Radio, Row, Select } from 'antd';

import styles from '../InterviewRegistration/index.less';

const { Option } = Select;

const PersonalData = ({ form, dictObj, dictObjLoading, ...rest }) => {
    const { getFieldDecorator } = form;

    return (
        <>
            <Row className={styles.formWrapNew} gutter={120} {...rest}>
                <Col lg={12} md={24}>
                    <Form.Item label="中文名">
                        {getFieldDecorator('talentName', {
                            initialValue: '',
                            rules: [
                                { required: true, message: '请输入中文名' },
                                {
                                    validator(rule, value, callback) {
                                        if (
                                            /[`~!#$%^&*()+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】、；‘’，。、]/g.test(
                                                value
                                            )
                                        ) {
                                            callback('不允许输入特殊字符');
                                        } else {
                                            callback();
                                        }
                                    }
                                },
                                {
                                    min: 2,
                                    max: 50,
                                    message: '中文姓名字数范围:2到50个字符'
                                }
                            ]
                        })(<Input placeholder="请输入" maxLength={50} allowClear />)}
                    </Form.Item>
                </Col>
                <Col lg={12} md={24}>
                    <Form.Item label="英文名">
                        {getFieldDecorator('talentNameEn', {
                            initialValue: '',
                            rules: [
                                {
                                    validator(rule, value, callback) {
                                        if (
                                            /[`~!#$%^&*()+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】、；‘’，。、]/g.test(
                                                value
                                            )
                                        ) {
                                            callback('不允许输入特殊字符');
                                        } else {
                                            callback();
                                        }
                                    }
                                },
                                {
                                    min: 2,
                                    max: 50,
                                    message: '英文名字数范围:2到50个字符'
                                }
                            ]
                        })(<Input placeholder="请输入" allowClear />)}
                    </Form.Item>
                </Col>
                <Col lg={12} md={24}>
                    <Form.Item label="性别">
                        {getFieldDecorator('talentSex', {
                            initialValue: '1',
                            rules: [
                                {
                                    required: true,
                                    message: '请选择性别'
                                }
                            ]
                        })(
                            <Radio.Group>
                                <Radio value="1">男</Radio>
                                <Radio value="2">女</Radio>
                            </Radio.Group>
                        )}
                    </Form.Item>
                </Col>
                <Col lg={12} md={24}>
                    <Form.Item label="手机号码">
                        {getFieldDecorator('talentPhone', {
                            initialValue: '',
                            rules: [
                                {
                                    required: true,
                                    message: '请输入手机号码'
                                    // whitespace: true
                                },
                                {
                                    validator(rule, value, callback) {
                                        const regex = /[a-zA-Z\u4e00-\u9fa5 ]+/g;
                                        if (value && regex.test(value)) {
                                            callback('手机号码不能包含中英文字符和空格');
                                        }
                                        callback();
                                    }
                                }
                            ]
                        })(
                            <Input
                                placeholder="请输入"
                                allowClear
                                maxLength={20}
                                // style={{ marginTop: 4 }}
                                addonBefore={getFieldDecorator('phoneAreaCode', {
                                    initialValue: '86'
                                })(
                                    <Select placeholder="请选择区号" style={{ width: 80 }}>
                                        <Option value="86">+86</Option>
                                        <Option value="65">+65</Option>
                                    </Select>
                                )}
                            />
                        )}
                    </Form.Item>
                </Col>
                <Col lg={12} md={24}>
                    <Form.Item label="个人邮箱">
                        {getFieldDecorator('talentEmail', {
                            initialValue: '',
                            rules: [
                                {
                                    required: true,
                                    message: '请输入个人邮箱'
                                },
                                {
                                    message: '请输入正确的个人邮箱',
                                    type: 'email'
                                }
                            ]
                        })(<Input placeholder="请输入" allowClear maxLength={100} />)}
                    </Form.Item>
                </Col>
                {/* <Col lg={12} md={24}>
                <Form.Item label="证件号码">
                    {getFieldDecorator('talentIdCard', {
                        initialValue: '',
                        rules: [
                            {
                                required: true,
                                message: '请输入证件号码',
                                whitespace: true
                            },
                            {
                                validator(rule, value, callback) {
                                    const regex = /[\u4e00-\u9fa5]+/g;
                                    if (value && regex.test(value)) {
                                        callback('证件号码不能包含中文字符');
                                    }
                                    callback();
                                }
                            }
                        ]
                    })(<Input placeholder="请输入证件号码" maxLength={100} allowClear />)}
                </Form.Item>
            </Col> */}
                <Col lg={12} md={24}>
                    <Form.Item label="出生年月" required>
                        {getFieldDecorator('talentBirth', {
                            initialValue: null,
                            rules: [
                                {
                                    required: true,
                                    message: '请选择出生年月'
                                    // whitespace: true
                                }
                            ]
                        })(<DatePicker.MonthPicker placeholder="请选择" style={{ width: '100%' }} />)}
                    </Form.Item>
                </Col>
                {/* <Col lg={12} md={24}>
                <Form.Item label="国籍/户籍">
                    {getFieldDecorator('talentNativePlace', {
                        rules: [
                            {
                                required: true,
                                message: '请选择国籍/户籍'
                            }
                        ]
                    })(
                        <CityPicker
                            showSearch
                            valueType="array"
                            style={{ width: '100%' }}
                            placeholder="请选择国籍/户籍"
                            getPopupContainer={trigger => trigger.parentElement}
                        />
                    )}
                </Form.Item>
            </Col>
            <Col lg={12} md={24}>
                <Form.Item label="现居地">
                    {getFieldDecorator('address', {
                        rules: [
                            {
                                required: true,
                                message: '请选择现居地'
                            }
                        ]
                    })(
                        <CityPicker
                            showSearch
                            valueType="array"
                            style={{ width: '100%' }}
                            placeholder="请选择现居地"
                            getPopupContainer={trigger => trigger.parentElement}
                        />
                    )}
                </Form.Item>
            </Col> */}
            </Row>
            <Row className={styles.formWrapNew} gutter={120} {...rest}>
                <Col lg={12} md={24}>
                    <Form.Item label="参加工作时间">
                        {getFieldDecorator('talentStartWorkTime')(
                            <DatePicker.MonthPicker placeholder="请选择" style={{ width: '100%' }} />
                        )}
                    </Form.Item>
                </Col>
                {/* <Col span={24}>
                <Form.Item label="头像" style={{ marginBottom: 0 }}>
                    <div style={{ height: 102 }}>
                        {getFieldDecorator('avatarRelation')(
                            <FileUpload
                                isSingle
                                businessCode="SysAvatar"
                                categoryCode="talentAvatarFile"
                                checkFileType="PNG,JPG,JPEG,BMP"
                                checkFileTypeMsg="只能上传PNG,JPG,JPEG,BMP格式的文件！"
                            />
                        )}
                    </div>
                    <span>支持.png、.jpg、.jpeg、.bmp格式</span>
                </Form.Item>
            </Col> */}
                <Col lg={12} md={24}>
                    <Form.Item label="工作状态">
                        {getFieldDecorator('lastPostStatus', {
                            initialValue: '',
                            rules: [
                                {
                                    required: true,
                                    message: '请选择工作状态'
                                    // whitespace: true
                                }
                            ]
                        })(
                            <Select placeholder="请选择" style={{ width: '100%' }}>
                                <Option value="2" label="离职">
                                    离职
                                </Option>
                                <Option value="1" label="在职">
                                    在职
                                </Option>
                                <Option value="3" label="应届生">
                                    应届生
                                </Option>
                            </Select>
                        )}
                    </Form.Item>
                </Col>
            </Row>
        </>
    );
};

export default React.memo(PersonalData);
